<template>
  <div id="app">
    <ul v-if="list.length > 0">
      <li v-for="(item, index) in list" :key="index" @click="deleteItem(index)">
        {{ item }}
      </li>
    </ul>
    <div v-else>没有数据了</div>
  </div>
</template>

<script>
export default {
  name: "App",
  data() {
    return {
      list: ["苹果", "香蕉", "橘子", "葡萄", "葡萄"],
    };
  },
  methods: {
    deleteItem(index) {
      console.log("删除的索引" + index);
      this.list.splice(index, 1);
    },
  },
};
</script>

<style></style>
